// 存储所有页面的所有模块状态 以供条件判断使用
import cloneDeep from 'lodash/cloneDeep'

const state = () => ({
  // pageModulesState: [],
  pageModulesStates: {},
  pageModulesStatesFlag: {},
})

const getters = {
  // getPageModulesState(state) {
  //   return state.pageModulesState
  // },
  getPageModulesStates(state) {
    return (pageId) => {
      return state.pageModulesStates[pageId]
    }
  },
  getPageModulesStatesFlag(state) {
    return (pageId) => {
      return state.pageModulesStatesFlag[pageId]
    }
  },
}

const mutations = {
  // setPageModulesState(state, val) {
  //   state.pageModulesState = val
  // },
  setPageModulesStates(state, val) {
    state.pageModulesStates[val.pageId] = val.pageState
  },
  setPageModulesStatesFlag(state, val) {
    // console.log('setPageModulesStatesFlag ------------------ 反反复复烦烦烦烦烦烦烦烦烦烦烦烦烦烦烦', cloneDeep(state.pageModulesStatesFlag))
    if (!state.pageModulesStatesFlag[val]) {
      state.pageModulesStatesFlag[val] = { flag: true }
    } else {
      state.pageModulesStatesFlag[val].flag = !state.pageModulesStatesFlag[val].flag
    }
    // console.log('setPageModulesStatesFlag ------------------ vvvvvvvvvvvvvvvvvvvvvvvvv', cloneDeep(state.pageModulesStatesFlag))
  },
}

const actions = {
  // 设置初始化页面组件状态或修改页面组件状态
  // setPageModulesState({ commit }, val) {
  //   // 判断 val 值类型
  //   // 如果为 Array 则代表为模块值改变触发, 直接提交即可
  //   // 如果为 Object 则代表为添加模块或者页面，则需要处理
  //   // console.log('val', val)
  //   console.log('触发设置初始化页面组件状态或修改页面组件状态 --------------------- ')
  //   let stateList = []
  //   const eachFunc = (obj) => {
  //     stateList.push({
  //       id: obj._id, // 组件id
  //       value: '', // 组件值
  //       status: '', // 组件状态
  //     })
  //     obj.pageModules &&
  //       obj.pageModules.forEach((item) => {
  //         eachFunc(item)
  //       })
  //     obj.list &&
  //       obj.list.forEach((item) => {
  //         eachFunc(item)
  //       })
  //   }
  //   if (Array.isArray(val)) {
  //     stateList = val
  //   } else {
  //     eachFunc(val)
  //   }

  //   commit('setPageModulesState', stateList)
  // },
  // 设置初始化页面组件状态或修改页面组件状态
  setPageModulesStates({ commit }, val) {
    // 判断 val 值类型
    // 如果为 Array 则代表为模块值改变触发, 直接提交即可
    // 如果为 Object 则代表为添加模块或者页面，则需要处理
    // console.log('val', val)
    let stateList = []
    const eachFunc = (obj) => {
      stateList.push({
        id: obj._id, // 组件id
        value: '', // 组件值
        status: '', // 组件状态
      })
      obj.pageModules &&
        obj.pageModules.forEach((item) => {
          eachFunc(item)
        })
      obj.list &&
        obj.list.forEach((item) => {
          eachFunc(item)
        })
    }
    if (Array.isArray(val.pageState)) {
      stateList = val.pageState
    } else {
      eachFunc(val.pageState)
    }

    commit('setPageModulesStates', { pageId: val.pageId, pageState: stateList })
    commit('setPageModulesStatesFlag', val.pageId)
  },
  // 批量修改页面组件时触发
  // setPageModulesStateByObj({ state, commit }, val) {
  //   let dataObj = val.dataObj || {}
  //   let moduleObj = val.moduleObj || {}
  //   let stateObj = {}

  //   // 写法一：考虑提交部分数据会覆盖页面组件原有值的情况
  //   // let oldState = cloneDeep(state.pageModulesState)
  //   // const eachFunc = (obj) => {
  //   //   // 由于可能存在此次更新数据为一部分数据，这种情况下会覆盖原有值，所以放到函数里遍历老的状态列表
  //   //   oldState.forEach((stateItem) => {
  //   //     if (stateItem.id === obj._id) {
  //   //       // 如果此次更改没有提交当前组件绑定值，则不覆盖值
  //   //       stateItem.value = dataObj[obj?.extension?.model?.value] === undefined ? stateItem.value : dataObj[obj?.extension?.model?.value]
  //   //     }
  //   //   })
  //   //   stateObj[obj._id] = dataObj[obj?.extension?.model?.value] || ''
  //   //   obj.pageModules &&
  //   //     obj.pageModules.forEach((item) => {
  //   //       eachFunc(item)
  //   //     })
  //   //   obj.list &&
  //   //     obj.list.forEach((item) => {
  //   //       eachFunc(item)
  //   //     })
  //   // }
  //   // eachFunc(moduleObj)

  //   // 写法二：打开页面时不考虑页面之前的数据（来源于数据注入）,直接清空所有数据
  //   const eachFunc = (obj) => {
  //     stateObj[obj._id] = dataObj[obj?.extension?.model?.value] || ''
  //     obj.pageModules &&
  //       obj.pageModules.forEach((item) => {
  //         eachFunc(item)
  //       })
  //     obj.list &&
  //       obj.list.forEach((item) => {
  //         eachFunc(item)
  //       })
  //   }
  //   eachFunc(moduleObj)
  //   let oldState = cloneDeep(state.pageModulesState)
  //   oldState.forEach((item) => {
  //     item.value = stateObj[item.id] || ''
  //   })

  //   commit('setPageModulesState', oldState)
  // },
  // 批量修改页面组件时触发
  setPageModulesStatesByObj({ state, commit }, val) {
    let dataObj = val.pageState.dataObj || {}
    let moduleObj = val.pageState.moduleObj || {}
    let stateObj = {}

    // 写法二：打开页面时不考虑页面之前的数据（来源于数据注入）,直接清空所有数据
    const eachFunc = (obj) => {
      stateObj[obj._id] = dataObj[obj?.extension?.model?.value] || ''
      obj.pageModules &&
        obj.pageModules.forEach((item) => {
          eachFunc(item)
        })
      obj.list &&
        obj.list.forEach((item) => {
          eachFunc(item)
        })
    }
    eachFunc(moduleObj)
    let oldState = cloneDeep(state.pageModulesStates[val.pageId])
    oldState.forEach((item) => {
      // 修改为只更改当前打开的页面中有的模块的状态 防止打开三级页面时删除二级页面的状态导致判断错误
      if (stateObj[item.id] !== undefined) {
        item.value = stateObj[item.id]
      }
    })

    commit('setPageModulesStates', { pageId: val.pageId, pageState: oldState })
    commit('setPageModulesStatesFlag', val.pageId)
  },
  // 添加页面组件时触发（循环表单等场景）
  // addPageModulesState({ commit }, val) {
  //   console.log('添加页面组件时触发（循环表单等场景）')
  //   let stateList = []
  //   const eachFunc = (obj) => {
  //     const formData = obj?.data?.formData || {}
  //     // stateList.push({
  //     //   id: obj._id, // 组件id
  //     //   value: '', // 组件值
  //     //   status: '', // 组件状态
  //     // })
  //     obj.pageModules &&
  //       obj.pageModules.forEach((item) => {
  //         eachFunc1(item, formData)
  //       })
  //     obj.list &&
  //       obj.list.forEach((item) => {
  //         eachFunc1(item, formData)
  //       })
  //   }
  //   const eachFunc1 = (obj, formData) => {
  //     if (obj?.extension?.model) {
  //       stateList.push({
  //         id: obj._id, // 组件id
  //         value: formData[obj.extension.model.value], // 组件值
  //         status: '', // 组件状态
  //       })
  //     }
  //     obj.pageModules &&
  //       obj.pageModules.forEach((item) => {
  //         eachFunc1(item, formData)
  //       })
  //     obj.list &&
  //       obj.list.forEach((item) => {
  //         eachFunc1(item, formData)
  //       })
  //   }
  //   val.forEach((item) => {
  //     eachFunc(item)
  //   })
  //   let oldState = cloneDeep(state.pageModulesState)
  //   stateList.concat(oldState)
  //   commit('setPageModulesState', stateList)
  // },
  // 添加页面组件时触发（循环表单等场景）
  addPageModulesStates({ state, commit }, val) {
    console.log('添加页面组件时触发（循环表单等场景）')
    let stateList = []
    const eachFunc = (obj) => {
      const formData = obj?.data?.formData || {}
      // stateList.push({
      //   id: obj._id, // 组件id
      //   value: '', // 组件值
      //   status: '', // 组件状态
      // })
      obj.pageModules &&
        obj.pageModules.forEach((item) => {
          eachFunc1(item, formData)
        })
      obj.list &&
        obj.list.forEach((item) => {
          eachFunc1(item, formData)
        })
    }
    const eachFunc1 = (obj, formData) => {
      if (obj?.extension?.model) {
        stateList.push({
          id: obj._id, // 组件id
          value: formData[obj.extension.model.value], // 组件值
          status: '', // 组件状态
        })
      }
      obj.pageModules &&
        obj.pageModules.forEach((item) => {
          eachFunc1(item, formData)
        })
      obj.list &&
        obj.list.forEach((item) => {
          eachFunc1(item, formData)
        })
    }
    val.pageState.forEach((item) => {
      eachFunc(item)
    })
    // console.log('state.pageModulesStates ----------------- ', state)
    let oldState = cloneDeep(state.pageModulesStates[val.pageId])
    stateList.concat(oldState)
    commit('setPageModulesStates', { pageId: val.pageId, pageState: stateList })
    commit('setPageModulesStatesFlag', val.pageId)
  },
}

export default {
  state,
  getters,
  mutations,
  actions,
}
